<template lang="pug">
  .error-card
    divider {{error}}
    .qrcode-base
      img(:src="qrcode")
      .tip 关注{{follower}}有优惠券提醒
</template>
<script>
import Divider from './Divider'
import SiteInfo from '../helpers/site_info'

export default {
  name: 'ErrorCard',
  props: ['error'],
  components: {
    Divider
  },
  computed: {
    qrcode () {
      return this.site_info.qr_code
    },
    follower () {
      return this.site_info.follower
    },
    site_info () {
      return SiteInfo.get()
    }
  }
}
</script>
<style lang="sass">
@import '../styles/color.sass';
.error-card
  min-height: 200px
  padding-top: 10px
  font-weight: 200
  display: flex
  flex-direction: column
  justify-content: center
  align-items: center
  color: $gray
  .qrcode-base
    display: flex
    flex-direction: column
    justify-content: center
    align-items: center
    color: $gray
    padding-bottom: 15px
    img
      height: 160px
    .tip
      text-align: center
</style>
